<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="js/echarts.js"></script>
	</head>
	<body>
		<script type="text/javascript">
function createRandomItemStyle() {    //随机颜色
    return {
        normal: {
            color: 'rgb(' + [
                Math.round(Math.random() * 160),
                Math.round(Math.random() * 160),
                Math.round(Math.random() * 160)
            ].join(',') + ')'
        }
    };
}
			require.config({
				paths:{
					echarts:'./js'
				}
			});
			require(
				 [	
                	'echarts',
                	'echarts/chart/line',
		            'echarts/chart/bar',
		            'echarts/chart/scatter',
		            'echarts/chart/k',
		            'echarts/chart/pie',
		            'echarts/chart/radar',
		            'echarts/chart/force',
		            'echarts/chart/chord',
		            'echarts/chart/gauge',
		            'echarts/chart/funnel',
		            'echarts/chart/eventRiver',
		            'echarts/chart/venn',
		            'echarts/chart/treemap',
		            'echarts/chart/tree',
		            'echarts/chart/wordCloud',
		            'echarts/chart/heatmap',
		            'echarts/chart/map'
                ],
             	function (ec){
             		 var myChart = ec.init(document.getElementById('main'));
             		var option = {
						    title: {
						        text: 'Google Trends',
						        link: 'http://www.google.com/trends/hottrends'
						    },
						    tooltip: {
						        show: true
						    },
						    series: [{
						        name: 'Google Trends',//鼠标悬浮，提示显示
						        type: 'wordCloud',
						        size: ['80%', '80%'],//宽度与高度设置
						        textRotation : [0, -45, 45, 90],
						        //textRotation:[0,30,60,90,120],//字符串随机倾斜角度
						        center: ['50%', '50%'] ,
						        textPadding: 5, //字符串内边
						        
						        autoSize: {
						            enable: true,
						            minSize: 24
						           
						        },
						       
						        data: [{ name: '', value: 2000,itemStyle: createRandomItemStyle()},
						            { name: "财产清单", value: 43,itemStyle: {
						                    normal: {
						                        color: 'black'
						                    }
						                }
						            },
						            { name: "同居关系析产、", value: 689,itemStyle: createRandomItemStyle()},
						            { name: "出生医学证明", value: 448,itemStyle: createRandomItemStyle()},
						            { name: "共同财产清单", value: 200,itemStyle: createRandomItemStyle()}
						            
						            
						        ]
						    }]
						};
                    
             		
             	myChart.setOption(option);	
             	
             	
             	//事假绑定
             	var ecConfig = require('echarts/config');
                
				function eConsole(param) {
				    var mes = '【' + param.type + '】';//事件类型
//				    if (typeof param.seriesIndex != 'undefined') {
//				        mes += '  seriesIndex : ' + param.seriesIndex;
//				        mes += '  dataIndex : ' + param.dataIndex;//date数组的下标
//				    }
					//date中， param.value对应的value属性
					//date中， param.name对应的name属性
				    alert(param.value);
				    console.log(param);//
				}
                myChart.on(ecConfig.EVENT.CLICK, eConsole);//单机事件
             	
             	
             	
             	
             	
             	
             		
             	}
			);
		</script>
		<div id="main" style="height: 500px;  border: 1px solid #CCCCCC; padding: 10px;"></div>
	</body>
</html>
